<!-- src/views/admin/AdminAddGame.vue -->
<template>
  <div class="container mx-auto px-4 py-8">
    <h1 class="text-2xl font-bold mb-4">添加游戏</h1>
    <form @submit.prevent="addGame">
      <!-- 其他表单字段 -->
      <div class="md:col-span-2">
        <label for="image" class="block text-sm font-medium text-gray-700 mb-1">游戏封面</label>
        <input
            @change="handleFileUpload"
            type="file"
            id="image"
            class="w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500"
        >
      </div>
      <button type="submit" class="mt-4 bg-blue-500 hover:bg-blue-600 text-white font-medium py-2 px-4 rounded">提交</button>
    </form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      image: null,
      // 其他表单数据
    };
  },
  methods: {
    handleFileUpload(event) {
      this.image = event.target.files[0];
    },
    async addGame() {
      // 创建表单数据
      const formData = new FormData();
      formData.append('image', this.image);

      // 上传逻辑 (需要后端支持)
      try {
        // const response = await this.$axios.post('/api/upload', formData);
        console.log('上传成功');
      } catch (error) {
        console.error('上传失败', error);
      }
    }
  }
}
</script>